<div class="layui-card-header layui-card">
    <span class="layui-breadcrumb" lay-filter="breadcrumb">
        <a lay-href="">首页</a>
        <a><cite>支付配置</cite></a>
    </span>
</div>

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <li class="layui-this">支付通道</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-row">
                    <div class="layuiAdmin-btns" style="margin-bottom: 10px;">
                        <a lay-href="config/pay_passage/create" class="layui-btn" data-type="all" data-events="create">新增支付通道</a>
                        <button class="layui-btn layui-btn-danger" id="btnDelete">删除</button>
                        <button class="layui-btn layui-btn-normal" id="btnDisable">禁用</button>
                        <button class="layui-btn layui-btn-warm" id="btnEnable">启用</button>
                    </div>
                </div>
                <table id="cList" lay-filter="cList"></table>
            </div>
        </div>
    </div>
</div>




<script>
    layui.use(['table','util', 'form'], function() {
        var table = layui.table
            , $ = layui.$
            , form = layui.form
            , element = layui.element;

        element.render('breadcrumb', 'breadcrumb');//渲染导航信息

        var tplEdit = function (d) {
            return "<a class='layui-btn layui-btn-primary layui-btn-xs' lay-event='account'>子账户</a>" +
                "<a class='layui-btn layui-btn-primary layui-btn-xs' lay-event='rate'>费率</a>" +
                "<a class='layui-btn layui-btn-primary layui-btn-xs' lay-event='risk'>风控</a>" +
                "<a class='layui-btn layui-btn-xs' lay-event='edit'>编辑</a>"+
                "<button class='layui-btn layui-btn-xs' lay-event='test2' data-ifcode='" + d.ifCode + "'>测试</button>";
        };

        var tplStatus = function (d) {
            if (d.status == 0) {
                return "关闭";
            } else if (d.status == 1) {
                return "<span style='color: green'>开启</span>";
            }
        };

        var tplRate = function (d) {
            return "<span style='color: blue'>" + d.passageRate + "%</span>";
        };

        table.render({
            elem: '#cList'
            , url: layui.setter.baseUrl + '/config/pay_passage/list'
            , where: {access_token: layui.data(layui.setter.tableName).access_token}
            , id: 'tableReload'
            , cols: [[
                {type: 'checkbox'}
                , {field: 'id', title: '通道ID'}
                , {field: 'passageName', title: '通道名称'}
                , {field: 'ifTypeCode', title: '通道标识'}
                , {field: 'ifName', title: '接口名称'}
                //, {field: 'payTypeName', title: '支付类型'}
                , {field: 'passageRate', title: '通道费率', templet: tplRate}
                , {field: 'status', title: '通道状态', templet: tplStatus}
                , {field: 'edite', width: 300, title: '操作', templet: tplEdit}
            ]]
            , page: true
            , skin: 'line'
            ,done: function(res, curr, count) {
                $('[lay-event="test2"]').on('click', function(){
                    var ifCode = $(this).data("ifcode");
                    layer.prompt({
                        title: '请输入金额',
                        formType: 0 //prompt风格，支持0-2，2为输入框
                    }, function(value, index){
                        // 校验金额格式
                        if(/^[0-9]+([.]{1}[0-9]+){0,1}$/.test(value)) {
                            layer.close(index);
                            var data = {
                                ifCode: ifCode,
                                amount: value,
                                access_token: layui.data(layui.setter.tableName).access_token
                            };
                            // 发起请求
                            $.post(layui.setter.baseUrl + '/config/pay_passage/test', data, function(res) {
                                if (res.code === 0 && res.data) {
                                    try {
                                        // 将返回的data字符串解析为对象
                                        var parsedData = JSON.parse(res.data);
                                        // console.log(parsedData)
                                        // console.log(parsedData.payParams)
                                        // console.log(parsedData.payParams.payUrl)
                                        // console.log(parsedData.payParams.payMethod)
                                        // 检查是否有payParams并且payParams中有payUrl
                                        if (parsedData.payParams && parsedData.payParams.payUrl) {
                                            console.log(parsedData.payParams.payUrl+"成功进入")
                                            // // 创建一个临时div来存放表单
                                            // var tempDiv = document.createElement('div');
                                            // // 将payUrl（包含表单的HTML字符串）设置为tempDiv的innerHTML
                                            // tempDiv.innerHTML = parsedData.payParams.payUrl;
                                            //
                                            // // 将表单添加到body中，这会导致浏览器解析并渲染表单
                                            // document.body.appendChild(tempDiv);
                                            //
                                            // // 查找并提交表单，由于表单已经包含自动提交的脚本，这一步可能是多余的
                                            // // 但如果出于某种原因脚本没有执行，可以手动提交表单
                                            // var form = tempDiv.querySelector('form');
                                            // if (form) {
                                            //     form.submit();
                                            // }
                                            // 在新标签页中打开指定的 URL
                                            window.open(parsedData.payParams.payUrl, '_blank');
                                        }
                                    } catch (e) {
                                        console.error('处理支付数据出错:', e);
                                    }
                                } else {
                                    // 处理错误情况
                                    layer.msg(res.data == null ? res.msg : res.data, {icon: 2});
                                }
                            }, 'json');
                        } else {
                            layer.msg('请输入正确的金额', {icon: 2});
                        }
                    });
                });
            }
        });

        // 监听工具条
        table.on('tool(cList)', function (obj) {
            var data = obj.data;
            if (obj.event === 'account') {
                location.href = layui.setter.baseLocal + "config/pay_passage_account//payPassageId=" + data.id;
            } else if (obj.event === 'rate') {
                location.href = layui.setter.baseLocal + "config/pay_passage/rate_set/id=" + data.id;
            } else if (obj.event === 'risk') {
                location.href = layui.setter.baseLocal + "config/pay_passage/risk_set/id=" + data.id;
            } else if (obj.event === 'edit') {
                location.href = layui.setter.baseLocal + "config/pay_passage/update/id=" + data.id;
            }
        });

        // 渲染表单
        form.render();

        // 监听删除按钮点击事件
        $('#btnDelete').click(function () {
            var checkStatus = table.checkStatus('tableReload');
            var data = checkStatus.data;
            var payPassageList = [];
            for (var i = 0; i < data.length; i++) {
                payPassageList.push(data[i].id);
            }
            if (payPassageList.length > 0) {
                // 调用删除接口，payPassageList为要删除的通道ID数组
                $.ajax({
                    url: layui.setter.baseUrl + '/config/pay_passage/deleteList',
                    type: 'POST',
                    data: {payPassageList: payPassageList.join(',')},
                    success: function () {
                        layer.msg('删除成功');
                        // 删除成功后重新加载表格数据
                        table.reload('tableReload');
                    },
                    error: function (xhr, status, error) {
                        layer.msg('删除失败：' + error); // 显示错误信息
                    }
                });
            } else {
                layer.msg('请选择要删除的通道');
            }
        });

// 监听禁用按钮点击事件
        $('#btnDisable').click(function () {
            var checkStatus = table.checkStatus('tableReload');
            var data = checkStatus.data;
            var payPassageList = [];
            for (var i = 0; i < data.length; i++) {
                payPassageList.push(data[i].id);
            }
            if (payPassageList.length > 0) {
                // 调用禁用接口，payPassageList为要禁用的通道ID数组
                $.ajax({
                    url: layui.setter.baseUrl + '/config/pay_passage/prohibitList',
                    type: 'POST',
                    data: {payPassageList: payPassageList.join(',')},
                    success: function () {
                        layer.msg('禁用成功');
                        // 禁用成功后重新加载表格数据
                        table.reload('tableReload');
                    },
                    error: function (xhr, status, error) {
                        layer.msg('禁用失败：' + error); // 显示错误信息
                    }
                });
            } else {
                layer.msg('请选择要禁用的通道');
            }
        });

// 监听启用按钮点击事件
        $('#btnEnable').click(function () {
            var checkStatus = table.checkStatus('tableReload');
            var data = checkStatus.data;
            var payPassageList = [];
            for (var i = 0; i < data.length; i++) {
                payPassageList.push(data[i].id);
            }
            if (payPassageList.length > 0) {
                // 调用启用接口，payPassageList为要启用的通道ID数组
                $.ajax({
                    url: layui.setter.baseUrl + '/config/pay_passage/startList',
                    type: 'POST',
                    data: {payPassageList: payPassageList.join(',')},
                    success: function () {
                        layer.msg('启用成功');
                        // 启用成功后重新加载表格数据
                        table.reload('tableReload');
                    },
                    error: function (xhr, status, error) {
                        layer.msg('启用失败：' + error); // 显示错误信息
                    }
                });
            } else {
                layer.msg('请选择要启用的通道');
            }
        });
    });

</script>

